<template>
	<div class="download_app_page">
		<div class="download_app_page_content">
			<span class="download_app_page_tip">您即将前往和讯财经APP阅读</span>
			<h1 class="download_app_page_title">{{title}}</h1>
			<span class="download_app_page_date">{{date}}</span>
		</div>
		<a href="javascript:;" @click="downloadApp($event)" class="download_app_page_button">下载app 关注更多新闻</a>
	</div>
</template>

<script>
	import BreadNav from "../../components/common/bread-nav.vue";
	export default {
		name:"DownloadApp",
		data:function(){
			let date = this.$route.params.datetime;
			return{
				title:this.getNewsContent(this.$route.params.id, date),
				date:date,
				channelName: "下载app",
				channelAlias: "/news"
			}
		},
		methods:{
			downloadApp(e){
				let id = this.$route.params.id,
					date = this.$route.params.datetime;
				
			},
			getNewsContent(id, date){
				let that = this;
				that.$http.jsonp(this.$store.state.api.newsDetailApi.tmpl({
					id:id,
					datetime:date
				})).then(function(res){
					that.$set(that, "title", res.body.data.title);
				},function(){

				});
			}
		},
		watch:{
			$route: function(){
				window.scrollTo(1,1);
				location.reload();
			}
		},
		components:{
			BreadNav
		},
		created:function(){
			window.scrollTo(1,1);
			this.$emit("upLocalData", [{
				name: "type",
				value: "downloadApp"
			},{
				name: "channelName",
				value: "下载"
			}]);
		}
	}
</script>

<style lang="less">
	@base:23.44/1rem;
	.download_app_page{
		.bread_nav{
			text-align: left;
		}
		text-align: center;
		padding:0 0 20/@base 0;
		min-height: 700/@base;
		background:url("//i0.hexun.com/2016/app_web/app_download/img/body_bg.png") no-repeat center bottom #fff;
		.download_app_page_content{
			min-height: 200/@base;
			h1{
				&.download_app_page_title{
					padding:30/@base 40/@base 10/@base 40/@base;
					font-size:30/@base;
					text-align: left;
				}
			}
			span{
				&.download_app_page_tip{
					padding:60/@base 40/@base 10/@base 40/@base;
					display:block;
					font-size: 24/@base;
					color:#999;
				}
				&.download_app_page_date{
					font-size:16/@base;
					padding:10/@base 40/@base;
					display:block;
					color:#999999;
					text-align: left;
				}
			}
		}
		a{
			&.download_app_page_button{
				width:300/@base;
				padding:10/@base 20/@base;
				background-color: #CC2020;
				color:#fff;
				font-size:24/@base;
				border-radius: 5/@base;
				text-align: center;
				display: block;
				margin: 40/@base auto;
			}
		}
	}
</style>
